<!DOCTYPE html>
<html lang="">

<head>
  <meta charset="UTF-8">
  <link rel="icon" href="/favicon.ico">
  <meta name="viewport"
    content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0, user-scalable=yes">
  <title>征兵通</title>
</head>

<body>
  <div id="app"></div>
  <script type="module" src="/src/main.js"></script>
</body>
<style>
  html,
  body,
  #app {
    height: 100%;
    margin: 0px;
    padding: 0px;
  }
</style>
<script>

  const width = document.body.clientWidth;
  const height = document.body.clientHeight;

  const isMobile = width <= 768; // 判断是否为手机
  const baseFontSize = isMobile ? 16 : 16; // 根据设备类型设置基准字体大小
  //根据设备类型采取不同方案
  // if (isMobile) {
  //   console.log("当前设备是手机，采取移动端方案");
  //   width = Math.min(width,768);
  //   const fontsize = (width / 1710) * baseFontSize;
  //   document.documentElement.style.fontSize = fontsize + "px";
  //   // 执行移动端逻辑
  // } else {
    console.log("当前设备是电脑，采取桌面端方案");
    // 计算字体大小
    const fontsize = (width / 1710) * baseFontSize;
    document.documentElement.style.fontSize = fontsize + "px";
  // }
</script>

</html>